<div class="row-content am-cf">
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
            <div class="widget am-cf">
                <div class="widget-body">
                    <form id="my-app" class="am-form tpl-form-line-form" method="post">
                    {if $model['app_auth_token'] != '' and isset($model['applet'])}
    				<div class="widget-head am-cf">
                        <div class="widget-title am-fl">小程序信息</div>
                    </div>
                    <fieldset>
                    <div class="am-form-group">
            			<label class="am-u-sm-3 am-u-lg-2 am-form-label am-text-xs">小程序头像 </label>
            			<div class="am-u-sm-9 am-u-end">
            				<div class="am-form-file">
            					<button type="button" class="upload-file am-btn am-btn-primary am-btn-xs">
            						<i class="am-icon-cloud-upload"></i> 选择图片
            					</button>
            					<div class="uploader-list am-cf">
                                    <div class="file-item">
                                        <img src="{$model['applet']['app_logo']|default='/assets/img/no_pic.jpg'}">
                                    </div>
                                </div>
            				</div>
            				<div class="help-block">
                                <small>图片格式为：png、jpg、jpeg；不超过2M；尺寸建议180px*180px</small>
                            </div>
            			</div>
            		</div>
                    <div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">
                            小程序名称
                        </label>
                        <div class="am-u-sm-9 am-u-end">
                            <input type="text" class="tpl-form-input" name="data[app_name]" value="{$model['applet']['app_name']|default=''}" required>
                            <small>名称可以由中文、数字、英文、下划线、+、-组成。<a target="_blank" href="https://opendocs.alipay.com/mini/operation/standard/auditing/name">《小程序命名审核规范》</a></small>
                        </div>
                    </div>
                    <div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require"> UID </label>
                        <div class="am-u-sm-9 am-u-end">
                            <input type="text" class="tpl-form-input" value="{$model['user_id']}" disabled>
                        </div>
                    </div>
                    <div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require"> AppID </label>
                        <div class="am-u-sm-9 am-u-end">
                            <input type="text" class="tpl-form-input" value="{$model['app_id']}" disabled>
                        </div>
                    </div>
					<div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">授权token </label>
                        <div class="am-u-sm-9 am-u-end">
                            <input type="text" class="tpl-form-input" value="{$model['app_auth_token']}" disabled>
                        </div>
                    </div>
                    <div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">AES密钥 </label>
                        <div class="am-u-sm-9 am-u-end">
                            <input type="text" class="tpl-form-input" value="{$model['aes_key']}" disabled>
                        </div>
                    </div>
                    <div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">
                            小程序简介
                        </label>
                        <div class="am-u-sm-9 am-u-end">
                            <input type="text" class="tpl-form-input" name="data[app_slogan]" value="{$model['applet']['app_slogan']|default=''}" required>
                            <small>10~32个字符，一个中文两个字符。</small>
                        </div>
                    </div>
                    <div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">
                            小程序类目
                        </label>
                        <div class="am-u-sm-9 am-u-end">
                            <input type="text" class="tpl-form-input" value="{$model['applet']['category_names']|default=''}" disabled>
                            <small>多个以“;”隔开。<a href="{:url('alipay.category/index')}">去设置</a></small>
                        </div>
                    </div>
                    <div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">
                            客服电话
                        </label>
                        <div class="am-u-sm-9 am-u-end">
                            <input type="number" class="tpl-form-input" name="data[service_phone]" value="{$model['applet']['service_phone']|default=''}" required>
                        </div>
                    </div>
                    <div class="am-form-group">
                        <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">
                            小程序描述
                        </label>
                        <div class="am-u-sm-9 am-u-end">
                            <textarea rows="3" name="data[app_desc]" required>{$model['applet']['app_desc']|default=''}</textarea>
                            <small>20-400个字符，一个中文两个字符。</small>
                        </div>
                    </div>
                    </fieldset>
                    <div class="am-form-group">
                        <div class="am-u-sm-9 am-u-sm-push-3 am-margin-top-lg">
                            <button type="submit" class="j-submit am-btn am-btn-secondary">提交
                            </button>
                        </div>
                    </div>
    				{else /}
                    <div class="widget-head am-cf">
                        <div class="widget-title am-fl">绑定支付宝小程序</div>
                    </div>
    				<div class="am-form-group">
    					<div style="background:#eeeeee;margin-left:100px;border-radius:10px;padding:20px;" class="am-u-sm-6 am-u-md-6 am-u-lg-3">
    						<div style="text-align:center;font-weight: 900;">我已有小程序</div>
    						<div style="margin-top:20px;text-align:center;">
    							<a id="auth" class="am-btn am-btn-default am-btn-success am-radius" href="javascript:;">
                                    扫码绑定
                                </a>
    						</div>
    						<div style="margin-top:20px;text-align:center;color:#999;">
    						    <small>支付宝APP扫码完成授权</small>
    						</div>
    					</div>
    					<div style="background:#eeeeee;margin-left:100px;border-radius:10px;padding:20px;" class="am-u-sm-6 am-u-md-6 am-u-lg-3 am-u-end">
    						<div style="text-align:center;font-weight: 900;">我还没有小程序</div>
    						<div style="margin-top:20px;text-align:center;">
    							<a class="am-btn am-btn-default am-btn-success am-radius" href="https://open.alipay.com/" target="_blank">
                                    快速注册
                                </a>
    						</div>
    						<div style="margin-top:20px;text-align:center;color:#999;">
    						    <small>登录开放平台去注册</small>
    						</div>
    					</div>
    				</div>
                    {/if}
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 图片文件列表模板 -->
{include file="../addons/upload/view/template/tpl_file_item_url.html" /}
<!-- 文件库弹窗 -->
{include file="../addons/upload/view/template/file_library.html" /}

{include file="alipay/auth" /}
<script>
    $(function () {
        
        //上传小程序头像
        $('.upload-file').selectImages({
            name: 'data[app_logo]'
        });
        //小程序授权
        $('#auth').on('click', function () {
            var url = "{$url}";
            if(url == ''){
                $.show_error('未配置支付宝开放平台参数');
                return false;
            }
            $.showAction({
                title: '请使用支付宝APP扫码', 
                area: '400px', 
                content: template('tpl-auth', {model:url}), 
                uCheck: true, 
                btn: ['取消'],
                success: function ($content) {
                    //检测授权状态
                    var interval = setInterval(function(){
                        $.post("{:url('alipay/auth')}",{},function(res){
                            if(res.code == 1){
                                window.location.reload();
                            }
                        });
                    },3000);
                }, 
                btn2: function ($content) {
                    return true;
                }
            });
        });
    });
</script>